<?php
/**
 * @link https://www.kancloud.cn/cleverstone/ymb2
 * @copyright Copyright (c) 2020 Yii Manager Software LLC
 */

use builder\helper\H5;
use yii\helpers\Json;

/* ================== 表格筛选表单模版  ================== */

/** @var \yii\web\View $this */
/* @var array $ttToolbarFilter 树表格筛选配置 */
/** @var string $builderID 树表格构建器ID */

$ctrlHideScope = "ym2TreeTableFilterControlUnspread_{$builderID}";
$attrNgHide = " ng-hide=\"{$ctrlHideScope}\"";
?>

<form class="layui-row layui-col-space16 mx-0">
<?php foreach ($ttToolbarFilter['columns'] as $field => $column): ?>
<?php switch ($column['control']): case 'datetime':?>
<?php case 'date':?>
<?php case 'year':?>
<?php case 'month':?>
<?php case 'time':?>
    <!--datetime/date/year/month/time-->
    <div class="layui-input-group layui-col-xs12 pl-0 <?= $column['class'] ?>"<?= $column['unspread'] ? $attrNgHide : '' ?>>
<?php if (!empty($column['label']) || !empty($column['help'])): ?>
        <span class="layui-input-prefix text-right ym2-control-prefix">
            <?= $column['label'] ?>
<?php if (!empty($column['help'])): ?>
            <!--帮助-->
            <i style="cursor: help;"
               class="layui-icon layui-icon-tips f12"
               data-toggle="popover"
               data-trigger="hover"
               data-custom-class="f13 white-space-pre-wrap pointer-event-none"
               data-html="true"
               data-content="<?= H5::encode($column['help']) ?>"
               ym2-bootstrap-plugin="popover"></i>
<?php endif; ?>
        </span>
<?php endif; ?>
        <input type="text"
               style="padding-right:5px;<?= $column['style'] ?>"
               name="<?= $field ?>"
               ng-model="ym2FilterForm['<?= $field ?>']"
               ym2-laydate
               ym2-range="<?= $column['range'] ?>"
               ym2-type="<?= $column['control'] ?>"
               placeholder="<?= $column['placeholder'] ?>"
               class="layui-input layui-input-sm border-left-trans f12"
               title="<?= $column['placeholder'] ?>"
               autocomplete="off"
               readonly="readonly"<?= $column['attribute'] ?>>
<?php if (!empty($column['quickChoice'])): ?>
            <div class="layui-input-suffix d-lsm-table-caption">
<?php foreach ($column['quickChoice'] as $itemName => $itemValue): ?>
                <span ng-class="{'active-this': ym2FilterForm['<?= $field ?>']=='<?= $itemValue ?>'}"
                      class="cp p-1 border-trans" ng-click="ym2FilterForm['<?= $field ?>']='<?= $itemValue ?>'">
                    <?= $itemName ?>

                </span>
<?php endforeach; ?>
            </div>
<?php endif; ?>
    </div>
<?php break; case 'select':?>
    <!--select-->
    <div class="layui-input-group layui-col-xs12 pl-0 <?= $column['class'] ?>" style="<?= $column['style'] ?>"<?= $column['unspread'] ? $attrNgHide : '' ?>>
<?php if (!empty($column['label']) || !empty($column['help'])): ?>
        <span class="layui-input-prefix text-right ym2-control-prefix">
            <?= $column['label'] ?>
<?php if (!empty($column['help'])): ?>
            <!--帮助-->
            <i style="cursor: help;"
               class="layui-icon layui-icon-tips f12"
               data-toggle="popover"
               data-trigger="hover"
               data-custom-class="f13 white-space-pre-wrap pointer-event-none"
               data-html="true"
               data-content="<?= H5::encode($column['help']) ?>"
               ym2-bootstrap-plugin="popover"></i>
<?php endif; ?>
        </span>
<?php endif; ?>

        <select ui-select2="<?= H5::encode(Json::encode($column['uiConfig'])) ?>"
                class="invisible"
                name="<?= $field ?>"
                <?= $column['multiple'] ? 'multiple' : '' ?>
                ng-model="ym2FilterForm['<?= $field ?>']"
                data-placeholder="<?= $column['placeholder'] ?>"<?= $column['attribute'] ?>>
<?php if (empty($column['multiple'])): ?>
                <option value=""><?= $column['placeholder'] ?></option>
<?php endif; ?>

<?php foreach ($column['options'] as $value => $text): ?>
<?php if (is_array($text)): ?>
                <optgroup label="<?= $value ?>">
<?php foreach ($text as $vv => $vTxt): ?>
                    <option <?= in_array($vv, $column['disabled']) ? 'disabled' : '' ?> value="<?= $vv ?>">
                        <?= $vTxt ?>
                    </option>
<?php endforeach; ?>
                </optgroup>
<?php else: ?>
                <option <?= in_array($value, $column['disabled']) ? 'disabled' : '' ?> value="<?= $value ?>">
                    <?= $text ?>
                </option>
<?php endif; ?>
<?php endforeach; ?>
        </select>
    </div>
<?php break; case 'select_link':?>
    <!--select link-->
    <div class="layui-input-group layui-col-xs12 pl-0 <?= $column['class'] ?>" style="<?= $column['style'] ?>"<?= $column['unspread'] ? $attrNgHide : '' ?>>
<?php if (!empty($column['label']) || !empty($column['help'])): ?>
        <span class="layui-input-prefix text-right ym2-control-prefix">
            <?= $column['label'] ?>
<?php if (!empty($column['help'])): ?>
            <!--帮助-->
            <i style="cursor: help;"
               class="layui-icon layui-icon-tips f12"
               data-toggle="popover"
               data-trigger="hover"
               data-custom-class="f13 white-space-pre-wrap pointer-event-none"
               data-html="true"
               data-content="<?= H5::encode($column['help']) ?>"
               ym2-bootstrap-plugin="popover"></i>
<?php endif; ?>
        </span>
<?php endif; ?>

<?php if ($column['flag'] == 'START'): // start ?>
        <select ui-select2="<?= H5::encode(Json::encode($column['uiConfig'])) ?>"
                class="invisible"
                <?= $column['attribute'] ?>
                name="<?= $field ?>"
                ng-change="selectLinkRequest('<?= $field ?>', '<?= $column["targetLink"] ?>', '<?= H5::encode($column["route"]) ?>')"
                ng-model="ym2FilterForm['<?= $field ?>']"
                data-placeholder="<?= $column['placeholder'] ?>">
            <option value=""><?= $column['placeholder'] ?></option>
            <optgroup ng-if="!<?= $field ?>__options.length"
                      label="{{index}}"
                      ng-repeat="(index, item) in <?= $field ?>__options">
                <option ng-repeat="son in item"
                        value="{{son.value}}"
                        ng-disabled="son.disabled"
                        ng-bind-html="son.text | toHtml">
                </option>
            </optgroup>
            <option ng-if="<?= $field ?>__options.length"
                    ng-repeat="item in <?= $field ?>__options"
                    value="{{item.value}}"
                    ng-disabled="item.disabled"
                    ng-bind-html="item.text | toHtml">
            </option>
        </select>
<?php elseif ($column['flag'] == 'THROUGH'): // through ?>
        <select ui-select2="<?= H5::encode(Json::encode($column['uiConfig'])) ?>"
                class="invisible"
                <?= $column['attribute'] ?>
                name="<?= $field ?>"
                ng-change="selectLinkRequest('<?= $field ?>', '<?= $column["targetLink"] ?>', '<?= H5::encode($column["route"]) ?>')"
                ng-model="ym2FilterForm['<?= $field ?>']"
                data-placeholder="<?= $column['placeholder'] ?>">
            <option value=""><?= $column['placeholder'] ?></option>
            <optgroup ng-if="!<?= $field ?>__options.length"
                      label="{{index}}"
                      ng-repeat="(index, item) in <?= $field ?>__options">
                <option ng-repeat="son in item"
                        value="{{son.value}}"
                        ng-disabled="son.disabled"
                        ng-bind-html="son.text | toHtml">
                </option>
            </optgroup>
            <option ng-if="<?= $field ?>__options.length"
                    ng-repeat="item in <?= $field ?>__options"
                    value="{{item.value}}"
                    ng-disabled="item.disabled"
                    ng-bind-html="item.text | toHtml">
            </option>
        </select>
<?php else: // $column['flag'] == 'END' end ?>
        <select ui-select2="<?= H5::encode(Json::encode($column['uiConfig'])) ?>"
                class="invisible"
                <?= $column['attribute'] ?>
                name="<?= $field ?>"
                ng-model="ym2FilterForm['<?= $field ?>']"
                data-placeholder="<?= $column['placeholder'] ?>">
            <option value=""><?= $column['placeholder'] ?></option>
            <optgroup ng-if="!<?= $field ?>__options.length"
                      label="{{index}}"
                      ng-repeat="(index, item) in <?= $field ?>__options">
                <option ng-repeat="son in item"
                        value="{{son.value}}"
                        ng-disabled="son.disabled"
                        ng-bind-html="son.text | toHtml">
                </option>
            </optgroup>
            <option ng-if="<?= $field ?>__options.length"
                    ng-repeat="item in <?= $field ?>__options"
                    value="{{item.value}}"
                    ng-disabled="item.disabled"
                    ng-bind-html="item.text | toHtml">
            </option>
        </select>
<?php endif; ?>
    </div>
<?php break; case 'text':?>
    <!--text-->
    <div class="layui-input-group layui-col-xs12 pl-0 <?= $column['class'] ?>"<?= $column['unspread'] ? $attrNgHide : '' ?>>
<?php if (!empty($column['label']) || !empty($column['help'])): ?>
        <span class="layui-input-prefix text-right ym2-control-prefix">
            <?= $column['label'] ?>
<?php if (!empty($column['help'])): ?>
            <!--帮助-->
            <i style="cursor: help;"
               class="layui-icon layui-icon-tips f12"
               data-toggle="popover"
               data-trigger="hover"
               data-custom-class="f13 white-space-pre-wrap pointer-event-none"
               data-html="true"
               data-content="<?= H5::encode($column['help']) ?>"
               ym2-bootstrap-plugin="popover"></i>
<?php endif; ?>
        </span>
<?php endif; ?>
        <input type="text"
               name="<?= $field ?>"
               ng-model="ym2FilterForm['<?= $field ?>']"
               style="<?= $column['style'] ?>"
               placeholder="<?= $column['placeholder'] ?>"
               title="<?= $column['placeholder'] ?>"
               class="layui-input layui-input-sm border-left-trans"
               autocomplete="on"<?= $column['attribute'] ?>>
    </div>
<?php break; case 'number':?>
    <!--number-->
    <div class="layui-input-group layui-col-xs12 pl-0 <?= $column['class'] ?>"<?= $column['unspread'] ? $attrNgHide : '' ?>>
<?php if (!empty($column['label']) || !empty($column['help'])): ?>
        <span class="layui-input-prefix text-right ym2-control-prefix">
            <?= $column['label'] ?>
<?php if (!empty($column['help'])): ?>
            <!--帮助-->
            <i style="cursor: help;"
               class="layui-icon layui-icon-tips f12"
               data-toggle="popover"
               data-trigger="hover"
               data-custom-class="f13 white-space-pre-wrap pointer-event-none"
               data-html="true"
               data-content="<?= H5::encode($column['help']) ?>"
               ym2-bootstrap-plugin="popover"></i>
<?php endif; ?>
        </span>
<?php endif; ?>
        <input type="number"
               string-to-number
               name="<?= $field ?>"
               ng-model="ym2FilterForm['<?= $field ?>']"
                <?= $column['attribute'] ?>
               style="<?= $column['style'] ?>"
               placeholder="<?= $column['placeholder'] ?>"
               title="<?= $column['placeholder'] ?>"
               class="layui-input layui-input-sm border-left-trans"
               autocomplete="off">
    </div>

<?php break; case 'checkbox': ?>
    <!--checkbox/tag-->
    <div class="layui-input-group layui-col-xs12 pl-0 <?= $column['class'] ?>"<?= $column['unspread'] ? $attrNgHide : '' ?>>
<?php if (!empty($column['label']) || !empty($column['help'])): ?>
        <span class="layui-input-prefix text-right ym2-control-prefix border-right">
            <?= $column['label'] ?>
<?php if (!empty($column['help'])): ?>
            <!--帮助-->
            <i style="cursor: help;"
               class="layui-icon layui-icon-tips f12"
               data-toggle="popover"
               data-trigger="hover"
               data-custom-class="f13 white-space-pre-wrap pointer-event-none"
               data-html="true"
               data-content="<?= H5::encode($column['help']) ?>"
               ym2-bootstrap-plugin="popover"></i>
<?php endif; ?>
        </span>
<?php endif; ?>
        <!--checkbox/tag-->
        <div class="ym2-tag-group layui-form layui-input layui-input-sm border-0" style="<?= $column['style'] ?>">
<?php foreach ($column['options'] as $value => $text): ?>
            <input type="checkbox"
                   layui-form-render
                   lay-filter="ym2_form_checkbox"
                   ng-model="ym2FilterForm['<?= $field ?>']['<?= $value ?>']"
                   ng-true-value="1"
                   ng-false-value="0"
                   name="<?= $field ?>[]"
                   title="<?= $text ?>"<?= $column['attribute'] ?>>
<?php endforeach; ?>
        </div>
    </div>

<?php break; case 'radio': ?>
    <!--radio-->
    <div class="layui-input-group layui-col-xs12 pl-0 <?= $column['class'] ?>"<?= $column['unspread'] ? $attrNgHide : '' ?>>
<?php if (!empty($column['label']) || !empty($column['help'])): ?>
        <span class="layui-input-prefix text-right ym2-control-prefix border-right">
            <?= $column['label'] ?>
<?php if (!empty($column['help'])): ?>
            <!--帮助-->
            <i style="cursor: help;"
               class="layui-icon layui-icon-tips f12"
               data-toggle="popover"
               data-trigger="hover"
               data-custom-class="f13 white-space-pre-wrap pointer-event-none"
               data-html="true"
               data-content="<?= H5::encode($column['help']) ?>"
               ym2-bootstrap-plugin="popover"></i>
<?php endif; ?>
        </span>
<?php endif; ?>

        <!--radio-->
        <div class="ym2-tag-group layui-form layui-input layui-input-sm border-0" style="<?= $column['style'] ?>">
<?php foreach ($column['options'] as $value => $text): ?>
            <input type="radio"
                   layui-form-render
                   lay-filter="ym2_form_radio"
                   ng-model="ym2FilterForm['<?= $field ?>']"
                   value="<?= $value ?>"
                   name="<?= $field ?>"
                   title="<?= !$column['labelIsHtml'] ? $text : '' ?>"<?= $column['attribute'] ?>>
<?php if ($column['labelIsHtml']): ?>
            <div lay-radio>
                <?= $text ?>
            </div>
<?php endif; ?>
<?php endforeach; ?>
        </div>
    </div>

<?php break; case 'select_layui':?>

    <!--layui下拉框-->
    <div class="layui-input-group layui-col-xs12 pl-0 <?= $column['class'] ?>"<?= $column['unspread'] ? $attrNgHide : '' ?>>
<?php if (!empty($column['label']) || !empty($column['help'])): ?>
        <span class="layui-input-prefix text-right ym2-control-prefix">
            <?= $column['label'] ?>
<?php if (!empty($column['help'])): ?>
            <!--帮助-->
            <i style="cursor: help;"
               class="layui-icon layui-icon-tips f12"
               data-toggle="popover"
               data-trigger="hover"
               data-custom-class="f13 white-space-pre-wrap pointer-event-none"
               data-html="true"
               data-content="<?= H5::encode($column['help']) ?>"
               ym2-bootstrap-plugin="popover"></i>
<?php endif; ?>
        </span>
<?php endif; ?>

        <div class="layui-form" style="<?= $column['style'] ?>">
            <select ngx-layuiform="select"
                    lay-filter="<?= 'filter__' . $field ?>"
                    ng-model="ym2FilterForm['<?= $field ?>']"
                    name="<?= $field ?>"<?= $column['attribute'] ?>>
                <option value=""><?= $column['placeholder'] ?></option>
<?php foreach ($column['options'] as $item): ?>
                <option value="<?= $item['value'] ?>"<?= !empty($item['disabled']) ? ' disabled' : '' ?>><?= $item['label'] ?></option>
<?php endforeach; ?>
            </select>
        </div>

    </div>

<?php break; endswitch; ?>
<?php endforeach; ?>

    <div class="<?= count($ttToolbarFilter['columns']) >= 4 ? 'float-right ' : '' ?>css__btn_container layui-btn-container layui-col-xs12 w-md-eq-content d-flex justify-content-end align-items-center pb-0 pl-0 pr-5 mr-5">
        <button type="button" class="layui-btn layui-btn-sm px-15 layui-btn-primary mb-0" ng-click="resetFilter()">重 置</button>
        <button class="layui-btn layui-btn-sm px-15 layui-btn-theme mb-0" ng-click="submitFilter()">查 询</button>
<?php if ($ttToolbarFilter['existUnspread']): ?>
        <span class="text-nowrap text-primary cp">
            <span ng-show="<?= $ctrlHideScope ?>" ng-click="toggleFilterControlDisplayStatus(false)">
                <span>展开</span>
                <i class="layui-icon layui-icon-down"></i>
            </span>
            <span ng-hide="<?= $ctrlHideScope ?>" ng-click="toggleFilterControlDisplayStatus(true)">
                <span>收起</span>
                <i class="layui-icon layui-icon-up"></i>
            </span>
        </span>
<?php endif; ?>
    </div>

</form>
